
/* Botão flutuante do chat */

h1{
    font-size: 1.3em; 
}
h2{
    font-size: 1.1em; 
}
.container_geral_sna_gpt_docs{
    position:fixed;
    left:0;
    top:0px;
    width:100%;
    height:100%;
    display:flex;
    background:White;
    z-index:999;
}
.container_menu_sna_gpt_docs{

    width:20%;
    height:100%; 
    border-right:1px solid gray;
    background:#036;

}

.container_logo_menu_sna_gpt_docs{
    padding-top:60px;
    padding-bottom:100px;
    width:200px;
    text-align: center;
    color:White;
    font-size:18px;
margin:0 auto;


}
    
.logo_menu_sna_gpt_docs{

    width:100%;
    margin-top: -7px;;
}


.container_links_docs_menu_sna_gpt_docs{

    width:80%;
    padding-left: 20px;
    padding-top: 20px;
    color:white;
    border-top:1px solid gold;
    gap:20px;
    display: flex;
    flex-direction: column;
    margin:0 auto;

}

.link_selecionar_docs_sna_gpt_docs{
cursor:pointer;
color:white;

}



.link_selecionar_docs_sna_gpt_docs:hover{
    color:gold !important;
    }
    
.container_chat_sna_gpt_docs{

    width:80%;
    margin:0 auto;
    box-sizing: border-box;
    padding:10px;
    overflow:auto;
    padding-bottom: 100px;
}


/* Container do chat */
#chat-container {

    width:100%;
    height:200px;
    background: white;
    border-radius: 10px;
    flex-direction: column;
    position:relative;
    height: auto;

}

#inicio-chat-messages{
width:100%;

margin:150px 20px;
box-sizing: border-box;



}

#titulo-conteudo-inicio-chat-messages{
font-size:30px;
color:#036;
margin-bottom:80px;

}
#imagens-conteudo-inicio-chat-messages{
    margin-bottom:80px;
display:flex;
justify-content: space-around;
color:#036;

}

#imagem-conteudo-inicio-chat-messages{
border:1px solid #ddd;
padding:50px;    
width:200px;
border-radius:10px;
position:relative;
}

#imagem-conteudo-inicio-chat-messages img{
    width:40px;
    
}
#imagem-conteudo-inicio-chat-messages div{
    position:absolute;
    bottom:20px;
    left:0px;
    width:100%;
    
}
#conteudo-inicio-chat-messages{
    width:60%;
    padding:40px;
    box-sizing: border-box;
    text-align:center;

    border-radius:10px;
    margin-left:18%;
  
    
    
    }
#chat-messages {
    padding: 10px;
    width:60%;
    margin-left: 20%;

    
padding-bottom:200px;
    flex-direction: column;
    overflow:hidden;
}

/* Mensagem enviada */
.message {
    padding: 8px;
    border-radius: 10px;
    margin: 5px 0;
    max-width: 80%;
    margin-bottom: 20px;
    padding:20px 30px;
  
}

.user-message {
    background: #DCF8C6;
    align-self: flex-end;
}
.system-message {
    background: #036;
    color:gold;
    border-radius:10px;
    font-size:12px;
    align-self: center;
}

.bot-message {
  
    
    box-shadow: 0 0px 4px rgba(0, 0, 0, 0.1); /* Horizontal | Vertical | Blur | Cor com opacidade */
            color:rgb(59, 59, 59);
    align-self: flex-start;
}

/* Entrada de mensagem */
#chat-input {

    display: flex;
    padding: 5px;
    background:white;
   
    border-radius: 10px;
    position:fixed;
    width: 79%;
    height:100px;
    left: 20%;
    bottom:0px;
}
/* Entrada de mensagem */
#chat-border {


    border:1px solid #ddd;
    border-radius: 10px;
    margin:0 auto;
    display: flex;
    padding:5px;
    width:60%;
    gap:10px;
    height:73px;

}

.input_enviar_msg_sna_gpt_docs {
    height:60px;
    border: none !important;
    padding: 12px;
    font-size: 18px;
    outline: none;
    width:100% !important;
    margin:0 auto;
    background: #ddd;
    color:gray;
}

#chat-input button {
    background: #25D366;
    border: none;
    color: white;
    padding: 10px;
    cursor: pointer;
    font-size: 18px;
    border-radius: 5px;
    height:60px;

}
